<div class="easyui-layout" data-options="fit:true">

    <!--查询-->
    <div data-options="region:'north',border:false" style="height:50px;width: 1150px;padding:5px">
        <form id="accAuthor_query_form" style="height:50px;width: 1150px">
            姓名： <input class="easyui-textbox" id="accAuthor_query_form_name" name="name"/>
            性别： <input id="accAuthor_query_form_sex" name="sex" style="width:70px"/>
            国籍： <input id="accAuthor_query_form_nationality_id" name="nationality_id" style="width:100px"/>
            状态： <input id="accAuthor_query_form_status" name="status" style="width:90px"/>
            创建时间：<input class="easyui-datebox" data-options="editable:false,required:false,validType:'date'"
                        id="accAuthor_query_form_date_start" name="date_start" style="width: 120px;"/>
            至：<input class="easyui-datebox" data-options="editable:false,required:false,validType:'date'"
                     id="accAuthor_query_form_date_end" name="date_end" style="width: 120px;"/>

            <a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-search'"
               onclick='accAuthorQuery();'>查询</a>
            <a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-clear'"
               onclick='accAuthorQueryClear();'>重置</a>
            <a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-add'"
               onclick='accAuthorAdd();'>新增</a>
        </form>
    </div>

    <!--        作者列表-->
    <div data-options="region:'center'" style="border:0;padding:5px;overflow:hidden;">
        <div style="width:1150px;height:100%;overflow:auto;border:1px solid #ccc;float:left">
            <table id="accAuthor_author_grid"></table>
        </div>
    </div>
</div>

<!--编辑作者-->
<div id="accAuthor_edit_dialog">
    <form id="accAuthor_edit_form" method="post">
        <table style="margin-bottom:20px;width:100%">
            <tr>
                <td><input type="hidden" id="accAuthor_edit_form_id" name="id"/></td>
            </tr>
            <tr>
                <td style="text-align: right;">姓名:</td>
                <td><input id="accAuthor_edit_form_name" name="name" class="easyui-textbox" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">性别:</td>
                <td><input id="accAuthor_edit_form_sex" name="sex" class="easyui-textbox" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">国籍:</td>
                <td><input id="accAuthor_edit_form_nationality_id" name="nationality_id" class="easyui-textbox" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">状态:</td>
                <td><input id="accAuthor_edit_form_status" name="status" required/></td>
            </tr>
        </table>
    </form>
</div>

<!--新增作者-->
<div id="accAuthor_add_dialog">
    <form id="accAuthor_add_form" method="post">
        <table style="margin-bottom:20px;width:100%">
            <tr>
                <td style="text-align: right;">姓名:</td>
                <td><input id="accAuthor_add_form_name" name="name" class="easyui-textbox" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">性别:</td>
                <td><input id="accAuthor_add_form_sex" name="sex" class="easyui-combobox" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">国籍:</td>
                <td><input id="accAuthor_add_form_nationality_id" name="nationality_id" class="easyui-textbox" required/></td>
            </tr>
        </table>
    </form>
</div>

<script>
    $(function () {
        initAuthorComponents();
        initAuthorGrid();
    });

    function initAuthorComponents() {
        $('#accAuthor_edit_form_sex').combobox({
            valueField: 'id', textField: 'text',
            panelHeight: 70, editable: false,
            data: [
                {"id": 1, "text": "男"},
                {"id": 0, "text": "女"}
            ]
        });

        $('#accAuthor_query_form_sex').combobox({
            valueField: 'id', textField: 'text',
            panelHeight: 99, editable: false,
            data: [
                {"id": 2, "text": "全部", selected: true},
                {"id": 1, "text": "男"},
                {"id": 0, "text": "女"}
            ]
        });

        $('#accAuthor_add_form_sex').combobox({
            valueField: 'id', textField: 'text',
            panelHeight: 70, editable: false,
            data: [
                {"id": 1, "text": "男", selected: true},
                {"id": 0, "text": "女"}
            ]
        });

        $('#accAuthor_edit_form_status').combobox({
            valueField: 'id', textField: 'text',
            panelHeight: 70, editable: false,
            data: [
                {"id": 1, "text": "可用"},
                {"id": 0, "text": "不可用"}
            ]
        });

        $('#accAuthor_query_form_status').combobox({
            valueField: 'id', textField: 'text',
            panelHeight: 99, editable: false,
            data: [
                {"id": 2, "text": "全部", selected: true},
                {"id": 1, "text": "可用"},
                {"id": 0, "text": "不可用"}
            ]
        });

        $("#accAuthor_edit_form_nationality_id").combogrid({
            url: '/queryAllNations',
            idField: 'id', textField: 'name',
            panelWidth: 160, panelHeight: 200,
            editable: true, mode: 'remote',
            columns: [
                [
                    {field: 'id', title: '编号', width: 50},
                    {field: 'name', title: '名称', width: 100}
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onClickRow: function (value, row, index) {}
        });

        $("#accAuthor_query_form_nationality_id").combogrid({
            url: '/queryAllNations',
            idField: 'id', textField: 'name',
            panelWidth: 160, panelHeight: 200,
            editable: true, mode: 'remote',
            columns: [
                [
                    {field: 'id', title: '编号', width: 50},
                    {field: 'name', title: '名称', width: 100}
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onClickRow: function (value, row, index) {}
        });

        $("#accAuthor_add_form_nationality_id").combogrid({
            url: '/queryAllNations',
            idField: 'id', textField: 'name',
            panelWidth: 160, panelHeight: 200,
            editable: true, mode: 'remote',
            columns: [
                [
                    {field: 'id', title: '编号', width: 50},
                    {field: 'name', title: '名称', width: 100}
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onClickRow: function (value, row, index) {}
        });
    }

    function initAuthorGrid() {
        $('#accAuthor_author_grid').datagrid({
            url: '/queryAllAuthors',
            idField: 'id',
            // fitColumns: true,
            fit: true, scrollbarSize: 1, striped: true,
            checkOnSelect: false, selectOnCheck: false, singleSelect: true,
            pagination: true, pageSize: 15, pageList : [15, 30, 60 ],
            columns: [
                [
                    {field: 'id', title: '编码', width: 50, align: 'center', halign: 'center'},
                    {field: 'name', title: '姓名', width: 150, align: 'center', halign: 'center'},
                    {field: 'sex', title: '性别', width: 50, align: 'center', halign: 'center',
                        formatter: function (value, row, index) {
                            if (value === 0) {
                                return '女';
                            } else if (value === 1) {
                                return '男';
                            } else {
                                return '';
                            }
                        }
                    },
                    {field: 'nationality_name', title: '国籍', width: 100, align: 'center', halign: 'center'},
                    {field: 'status', title: '状态', width: 50, align: 'center', halign: 'center',
                        formatter: function (value, row, index) {
                            if (value === 1) {
                                return '可用';
                            } else if (value === 0) {
                                return '不可用';
                            } else {
                                return '';
                            }
                        }
                    },
                    {field: 'ctime', title: '创建时间', width: 180, align: 'center', halign: 'center'},
                    {field: 'x', title: '操作', width: 180, align: 'center', halign: 'center',
                        formatter: function (value, row, index) {
                            return '<a href="javascript:void(0)" onclick="updateAuthorButton(' + row.id + ')">编辑</a>' +
                                '<a href="javascript:void(0)" onclick="deleteAuthorButton(' + row.id + ')">|删除</a>';
                        }
                    }
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onLoadSuccess: function (node, data) {},
            onClickRow: function (index, row) {}
        });
    }

    // 编辑作者
    function updateAuthorButton(author_id) {
        $('#accAuthor_author_grid').datagrid("selectRecord", author_id);
        var author = $('#accAuthor_author_grid').datagrid("getSelected");
        if (!author) {
            $.messager.alert("提示", "请选择要编辑的作者！", 'info');
            return;
        }

        // 加载编辑作者内容
        $("#accAuthor_edit_form").form('load', {
            id: author.id,
            name: author.name,
            sex: author.sex,
            nationality_id: author.nationality_id,
            status: author.status
        });

        $('#accAuthor_edit_dialog').dialog({
            title: '编辑作者', iconCls: 'icon-edit',
            width: 380, height: 350, modal: true, shadow: true,
            onClose: function () {
                $('#accAuthor_edit_form').form('clear').form('reset');
            },
            buttons: [
                {
                    id: 'accAuthor_edit_dialogsave',
                    text: '保存', iconCls: 'icon-save',
                    handler: updateAuthor
                }, {
                    id: 'accAuthor_edit_dialogclose',
                    text: '关闭', iconCls: 'icon-clear',
                    handler: function () {
                        $("#accAuthor_edit_dialog").dialog("close");
                    }
                }
            ]
        });
    }

    function updateAuthor() {
        if (!$('#accAuthor_edit_form').form('validate')) {
            return;
        }

        $('#accAuthor_edit_form').form('submit', {
            url: '/updateAuthor',
            ajax: true,
            onSubmit: function () {},
            success: function (data) {
                data = JSON.parse(data);

                if (data.code !== 200) {
                    $.messager.alert("提示", "作者更新失败！", 'info');
                    return;
                }

                $.messager.show({title: '提示', msg: '作者更新成功！', timeout: 2000, showType: 'slide'});

                $("#accAuthor_edit_dialog").dialog("close");
                $("#accAuthor_author_grid").datagrid("reload");
            }
        });
    }

    // 新增作者
    function accAuthorAdd() {
        $('#accAuthor_add_dialog').dialog({
            title: '新增作者', iconCls: 'icon-add',
            width: 380, height: 350, modal: true, shadow: true,
            onClose: function () {
                $('#accAuthor_add_form').form('clear').form('reset');
            },
            buttons: [
                {
                    id: 'accAuthor_add_dialogsave',
                    text: '保存', iconCls: 'icon-save',
                    handler: addAuthor
                }, {
                    id: 'accAuthor_add_dialogclose',
                    text: '关闭', iconCls: 'icon-clear',
                    handler: function () {
                        $("#accAuthor_add_dialog").dialog("close");
                    }
                }
            ]
        });
    }

    function addAuthor() {
        if (!$('#accAuthor_add_form').form('validate')) {
            return;
        }

        $('#accAuthor_add_form').form('submit', {
            url: '/addAuthor',
            ajax: true,
            onSubmit: function () {},
            success: function (data) {
                data = JSON.parse(data);

                if (data.code !== 200) {
                    $.messager.alert("提示", "新增作者失败！", 'info');
                    return;
                }

                $.messager.show({title: '提示', msg: '新增作者成功！', timeout: 2000, showType: 'slide'});

                $("#accAuthor_add_dialog").dialog("close");
                $("#accAuthor_author_grid").datagrid("reload");
            }
        });
    }

    function deleteAuthorButton(author_id) {
        $.messager.confirm('确认', '您确认想要删除该作者吗？', function (r) {
            if (!r) {return;}

            $.ajax({
                url: '/deleteAuthorById',
                type: "post",
                data: {id: author_id},
                dataType: "json",
                async: false,
                success: function (data) {
                    if (data.code !== 200) {
                        $.messager.alert("提示", data.message, 'info');
                        return;
                    }

                    $.messager.show({title: '提示', msg: '删除作者成功！', timeout: 2000, showType: 'slide'});
                    $("#accAuthor_author_grid").datagrid("reload");
                }
            });
        });
    }

    function accAuthorQuery() {
        $("#accAuthor_author_grid").datagrid('load', {
            name:$('#accAuthor_query_form_name').val(),
            sex:$('#accAuthor_query_form_sex').val(),
            nationality_id:$('#accAuthor_query_form_nationality_id').val(),
            status:$('#accAuthor_query_form_status').val(),
            date_start:$('#accAuthor_query_form_date_start').val(),
            date_end:$('#accAuthor_query_form_date_end').val()
        });
    }

    function accAuthorQueryClear() {
        $('#accAuthor_query_form_name').textbox('clear');
        $('#accAuthor_query_form_sex').combobox('setValue', 2);
        $('#accAuthor_query_form_nationality_id').combogrid('clear');
        $('#accAuthor_query_form_status').combobox('setValue', 2);
        $('#accAuthor_query_form_date_start').datebox('clear');
        $('#accAuthor_query_form_date_end').datebox('clear');
        $("#accAuthor_author_grid").datagrid('load', {
            name: null,
            sex: null,
            nationality_id: null,
            status: null,
            date_start: null,
            date_end: null
        });
    }
</script>